<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="../common/jspcommon.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%-- <title>${tagShow.name } - ${pdName } - 果果街</title> --%>
<title>逛街 - 妈妈们逛街了！ - 果果街</title>
<meta name="keywords" content="果果,果果街,果果网,童装, 淘宝网童装,孕妇装,洗护用品, 母婴用品,儿童美食,家居 ,亲子早教" />
<meta name="description" content="童装用品免费拿、参与活动有钱赚。20万件孕婴童精品，上百商家参与互动，最火的另类母婴亲子社区，妈妈们网上逛街的好地方！" />
<%@include file="../common/css.jsp"%>
<link href="css/v3/geziwu/geziwu.css" type="text/css" rel="stylesheet" />
<script src="js/jquery.1.4.4.min.js" type="text/javascript"></script>
<script src=http://a.tbcdn.cn/apps/top/x/sdk.js?appkey=21080975></script>
</head>
<body>
<%-- 头部 --%>
<%@include file="../common/header.jsp" %>
<div class="w100p">
	<%-- 广告位 --%>
	<!-- <div class="w980 mg mb10 clearfix">
    	<a target="_blank" href="#" class="fl block"><img src="../../../images/v3/otherpic/ad_732x61.png" class="block r5" /></a>
        <a target="_blank" href="#" class="fr block"><img src="../../../images/v3/otherpic/ad_235x61.png" class="block r5" /></a>
    </div> -->
    <div class="w980 mg mb10">
    	<div class="boxhead_v3 w970 mg pr h5">
        	<span class="lt"></span>
            <span class="rt"></span>	
        </div>
        <%-- 标签 --%>
        <div class="wrap_v3">
        	<div class="mt15 ml20 mb10">
            	<div class="clearfix">
            		<c:forEach items="${tags }" var="tag">
                    <div class="mr25 col${fn:substring((fn:length(tag.tagList)+3)/4,0,1)}_v3 fl">
                        <h3 class="f14 fn mb15"><a class="f14 ff6699" <c:if test="${tag.type==1 }">href="grid.htm?pd=${spfl }&id=${tag.identifier }&page=1"</c:if> >${tag.name }</a></h3>
                        <ul class="secmenu_v3 clearfix">
                        	<c:forEach items="${tag.tagList }" var="t">
                        	<c:if test="${t.identifier==tagShow.identifier }"><li><a href="grid.htm?pd=${spfl }&id=${t.identifier }&page=1" style="${t.style }" class="clickbg_v3">${t.name }</a></li></c:if>
                        	<c:if test="${t.identifier!=tagShow.identifier }"><li><a href="grid.htm?pd=${spfl }&id=${t.identifier }&page=1" style="${t.style }">${t.name }</a></li></c:if>
                            </c:forEach>
                        </ul>
                    </div>
					</c:forEach>
                </div>
            </div>
        </div>
        <div class="boxfoot_v3 w970 mg pr h5">
        	<span class="lb"></span>
            <span class="rb"></span>	
        </div>
    </div>
    <%-- 筛选 --%>
    <div class="w980 mg mb10">
    	<div class="mt5 ml5 clearfix choice_v3">
        	<h3 class="fl ff6699">${tagShow.name }</h3>
            <div class="fl ml25 mt5 clearfix">
            	<span class="choicesort_v3">排序：</span>
                <ul class="showchoice_v3 fl r3 clearfix">
                <c:choose>
					<c:when test="${type=='commend' }">
						<li class="fl"><a href="grid.htm?pd=${spfl }&tp=commend&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block tipli_v3 fl ff6699 fb" id="tj">推荐</a></li>
	                    <li class="nobgpad_v3 fl"></li>
	                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=new&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block fl" id="new">最新</a></li>
					</c:when>
					<c:otherwise>
						<li class="fl"><a href="grid.htm?pd=${spfl }&tp=commend&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block fl" id="tj">推荐</a></li>
	                    <li class="nobgpad_v3 fl"></li>
	                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=new&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block tipli fl ff6699 fb" id="new">最新</a></li>
					</c:otherwise>
				</c:choose>
                </ul>
            </div>
            <div class="fl ml25 mt5 clearfix">
            	<span class="choicesort_v3">性别：</span>
                <ul class="showchoice_v3 fl r3 clearfix">
                	<li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block <c:if test="${sex==null || sex=='' }">tipli_v3 ff6699 fb </c:if>fl">中性</a></li>
                    <li class="nobgpad_v3 fl"></li>
                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=100001875&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block <c:if test="${sex==100001875 }">tipli_v3 ff6699 fb </c:if>fl">男宝</a></li>
                    <li class="nobgpad_v3 fl"></li>
                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=100001876&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}" class="block <c:if test="${sex==100001876 }">tipli_v3 ff6699 fb </c:if>fl">女宝</a></li>
                </ul>
            </div>
            <div class="fl ml25 mt5 clearfix">
            	<span class="choicesort_v3">价格：</span>
                <ul class="showchoice_v3 fl r3 clearfix">
                	<li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }" class="block <c:if test="${minPrice==null && maxPrice==null }">tipli_v3 ff6699 fb</c:if> fl">全部</a></li>
                    <li class="nobgpad_v3 fl"></li>
                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&ma=50" class="block <c:if test="${maxPrice==50 }">tipli_v3 ff6699 fb</c:if> fl">50元</a></li>
                    <li class="nobgpad_v3 fl"></li>
                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&mi=50&ma=100" class="block <c:if test="${minPrice==50 }">tipli_v3 ff6699 fb</c:if> fl">100元</a></li>
                    <li class="nobgpad_v3 fl"></li>
                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&mi=100&ma=300" class="block <c:if test="${minPrice==100 }">tipli_v3 ff6699 fb</c:if> fl">300元</a></li>
                    <li class="nobgpad_v3 fl"></li>
                    <li class="fl"><a href="grid.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&mi=300" class="block <c:if test="${minPrice==300 }">tipli_v3 ff6699 fb</c:if> fl">更高</a></li>
                </ul>
            </div>
            <div class="fl ml25 mt5 clearfix stagesorts_v3">
            	<span class="fl f14 fb ff6699">阶段分类：</span>
                <a href="grid.htm?pd=baby">0-1岁</a><i>|</i><a href="grid.htm?pd=child">1-3岁</a><i>|</i><a href="grid.htm?pd=tz">三岁以上</a><i>|</i><a href="grid.htm?pd=zmm">准妈妈</a>
            </div>
        </div>
    </div>
    <div class="w980 mg mb5 mt5">
    	<div class="dashseparate"></div>
    </div>
    <%-- 内容 --%>
    <div class="w980 mg mb10 clearfix" id="cpshow">
    	<div class="cpshowwrap_v3 w920 clearfix" id="grid_content">
    		<c:forEach items="${pageModel.list }" var="doing" varStatus="v">
    		
	    		 <c:if test="${rushPlan!=null && (v.index+1)==rushPlan.randNum}">
			        	<div class="cpwrap_v3 w220 mr10 mb10 fl">
				            	<div class="boxhead_v3 w210 mg pr h5">
				                    <span class="lt"></span>
				                    <span class="rt"></span>	
				        		</div>
				                <div class="cpbody_v3">
				                    <div class="cppic_v3">
				                    	<div class="mt5 ml10 mr10 mb5">
					                       <a target="_blank" onclick="rushPhone();"class="block" style="cursor: pointer;">
								                <img alt="寻宝" src="${rushPlan.imageSever}${rushPlan.picUrl}" width="200px" class="pic_v3" height="300px"/>
								           </a>
								       </div>
				                    </div>
				                </div>
				                <div class="boxfoot_v3 w210 mg pr h5">
				        			<span class="lb"></span>
				            		<span class="rb"></span>	
				       			 </div>
			            </div>
	            </c:if>
        	<div class="cpwrap_v3 w220 mr10 mb10 fl">
            	<div class="boxhead_v3 w210 mg pr h5">
                    <span class="lt"></span>
                    <span class="rt"></span>	
        		</div>
                <div class="cpbody_v3">
                    <div class="cppic_v3">
                        <div class="mt5 ml10 mr10 mb5">
                            <ul>
                            <c:forEach items="${doing.doingProductList }" var="p">
                                <li class="mb5">
                                    <a target="_blank" href="dt.htm?pro=${p.identifier }" class="block"><img alt="${p.name }" title="${p.name }" src="${p.imageServer }${p.picThumb }_200xXXX.jpg" width="200" height="${p.height200xxx }" class="pic_v3" /></a>
                                    <span class="block fl pa hoverprice_v3"><i class="block fl">￥${p.price }</i><b class="block fl"></b></span>
                                    <a href="javascript:;"  picType="2" picproId="${p.identifier}" class="add_to_album_btn"></a>
                                </li>
                            </c:forEach>
                            </ul>
                            <div class="clearfix mt10 mb10">
                                <span class="fr"><a target="_blank" href="dt.htm?id=${doing.identifier }" class="fc9">评论</a><i class="fc9">(</i><a target="_blank" href="dt.htm?id=${doing.identifier }" class="fc9 unl">${doing.commentCount }</a><i class="fc9">)</i></span>
                                <c:if test="${sessionScope.member != null}">
                                <div class="fr mr10 fc9"><a href="javascript:void(0);" onclick="GUOGUO.loveDoing('${doing.identifier}','${doing.doorplate }',this)" class="fc9">喜欢</a><i>(</i><span class="unl">${doing.loveAmount }</span><i>)</i></div>
                                </c:if>
                                <c:if test="${sessionScope.member == null}">
                                <div class="fr mr10 fc9"><a href="javascript:void(0);" onclick="GUOGUO.memberLogin()" class="fc9">喜欢</a><i>(</i><span class="unl">${doing.loveAmount }</span><i>)</i></div>
                                </c:if>
                                <span class="pinkheart_v3 fr mr5 block"></span>
                            </div>
                        </div>
                    </div>
                    <div class="cpinfo_v3">
                    	<div class="mt10 mr5 ml10 mb10">
                        	<div class="mb10 clearfix">
                                <a target="_blank" href="cover.htm?fid=${doing.doorplate }" class="pic_v3 block fl mr5"><img alt="${doing.memberName }" width="26" height="26" nickname="${doing.memberName }" src="${doing.memberImageServer }${doing.memberAvatar }" class="block" /></a>
                                <div class="fl">
                                    <a target="_blank" href="cover.htm?fid=${doing.doorplate }" nickname="${doing.memberName }" class="ff6699">${doing.memberName }</a>
                                    <span class="block fc9 time_v3"><c:choose><c:when test="${type == 'new' }">${doing.lastDate }</c:when><c:otherwise>${doing.orderTime }</c:otherwise></c:choose></span>
                                </div>
                            </div>
                            <p class="info_v3">${doing.replaceContent }</p>
                        </div>
                    </div>
                </div>
                
                <div class="boxfoot_v3 w210 mg pr h5">
        			<span class="lb"></span>
            		<span class="rb"></span>	
       			 </div>
            </div>
            </c:forEach>
        </div>
        <%-- 分页 --%>
   		<div class="h_page" id="pager"></div>
    </div>
</div>
<div class="w100p" id="redSlide">
	<div class="w980 mg">
        <div class="back_v3">
            <a href="javascript:void(0);" class="backtop_v3"></a>
            <a href="javascript:void(0);" class="buyinfo_v3"></a>        
        </div>
    </div>
</div>
<%-- 底部 --%>
<%@include file="../common/footer.jsp"%>
<%@include file="../common/js.jsp"%>
<script type="text/javascript" src="js/web2/joinPictorial.js"></script>
<script type="text/javascript" src="js/v3/other/interfacejs.js"></script>
<script language="javascript">
	$(function() {
		<%-- 分页方法 --%>
		$("#pager").pager({
			pagenumber : "${pageModel.currentPage}",
			pagecount : "${pageModel.totalPage}",
			buttonClickCallback : function(page) {
				location.href = "grid.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}&page="+page;
			}
		});
		<%-- 图片加载完之后给div赋值样式 --%>
		$('.cpshowwrap_v3').masonry({
		  	itemSelector : '.cpwrap_v3'
		});
		
		<%-- 滚动加载效果 --%>
		var loaded = true;
		var times = 3;
		$(window).bind("scroll", function(){
			loginMaskDivShow();
			<%-- 滚动条到网页头部的 高度 --%>
	        var top = document.documentElement.scrollTop + document.body.scrollTop;
	        <%-- 网页的高度 --%>
	        var textheight = $(document).height();
			if (textheight - top - $(window).height() <= 1500) {
				if(loaded){
					loaded = false;
					<%-- 如果是最后一页，判断是否要取多次 --%>
					if(parseInt("${pageModel.currentPage}")==parseInt("${pageModel.totalPage}") 
							&& ((parseInt("${pageModel.currentPage}")-1)*parseInt("${pageModel.pageSize}")+(times-1)*(parseInt("${pageModel.pageSize}")/10))>=parseInt("${pageModel.totalRecord}")){
						return;
					}
					if(times>10){
						return;
					}
					<%-- 添加加载中的层 --%>
					$("#grid_content").after('<div class="loadingPic" id="Loading"><img src="../../../images/v3/commonpic/indicator_medium.gif" /></div>');
					<%-- 隐藏分页 --%>
					$("#pager").hide();		
					<%-- 隐藏底部 --%>
					$("#footer").hide();	
					$.get("gridMore.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}&page=${pageModel.currentPage}&times="+times,function(data){
					 	var $newElems = $(data);	
						$("#grid_content").append($newElems).masonry('appended',$newElems);
						<%-- 删除加载中的层 --%>
						$("#Loading").remove();		
						loaded = true;
						<%-- 计算次数，计算这一页取了多少此 --%>
						times++;	
						<%-- 展示分页 --%>
						$("#pager").show();
						<%-- 展示底部 --%>
						$("#footer").show();
				  	});
				}
			}
		});
		$.get("gridMore.htm?pd=${spfl }&tp=${type }&sex=${sex }&id=${tagShow.identifier }&mi=${minPrice}&ma=${maxPrice}&page=${pageModel.currentPage}&times=2",function(data){
		 	var $newElems = $(data);	
			$("#grid_content").append($newElems).masonry('appended',$newElems);
		});
		
		
		
	});
	function rushPhone(){
		 window.location.href="rushPhone.htm";
	}
</script>
</body>
</html>
